<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 引入 WeUI CDN 链接 -->
    <link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/2.3.0/weui.min.css">
</head>

<body class="df fdc">
    <!-- 主体 -->
    <div class="main-content f1 ofs">
        <!-- 头部 -->
        <div class="header df aic jcc">
            <a href="./my.html">
                < </a> 个人资料 </div> <!-- 主体 -->
                    <div class="content">
                        <!-- 上传头像框 -->
                        <input id="avatarIpt" type="file" multiple style="display: none;">

                        <!-- 表单 -->
                        <div class="weui-cells">
                            <div class="weui-cell weui-cell_active weui-cell_select" role="button"
                                aria-haspopup="listbox">
                                <div class="weui-cell__bd df jcsb avatar-box aic ">
                                    <div class="weui-select">更换头像</div>
                                    <img id="avatar" class="avatarImg" alt="" />
                                </div>
                            </div>
                            <!-- 昵称 -->
                            <label for="nickname" class="weui-cell weui-cell_active weui-cell_wrap">
                                <div class="weui-cell__hd">
                                    <span class="weui-label">昵称</span>
                                </div>
                                <div class="weui-cell__bd">
                                    <input id="nickname" class="weui-input weui-cell__control weui-cell__control_flex"
                                        placeholder="昵称" />
                                </div>
                            </label>
                            <!-- 性别 -->
                            <div id="showSexPicker" role="button" aria-haspopup="listbox"
                                class="weui-cell weui-cell_active weui-cell_select weui-cell_select-after">
                                <div class="weui-cell__hd"><label class="weui-label">性别</label></div>
                                <div class="weui-cell__bd">
                                    <div class="weui-select" id="selSex">女</div>
                                </div>
                            </div>
                            <!-- 生日 -->
                            <div class="weui-cell weui-cell_active weui-cell_select weui-cell_select-after"
                                role="button" aria-haspopup="listbox" id="showDatePicker">
                                <div class="weui-cell__hd"><label class="weui-label">生日</label></div>
                                <div class="weui-cell__bd">
                                    <div class="weui-select" id="selBirthday">2022</div>
                                </div>
                            </div>
                            <!-- 省份 -->
                            <div id="showProvincePicker" role="button" aria-haspopup="listbox"
                                class="weui-cell weui-cell_active weui-cell_select weui-cell_select-after">
                                <div class="weui-cell__hd"><label class="weui-label">省份</label></div>
                                <div class="weui-cell__bd">
                                    <div class="weui-select" id="selProvince">四川省</div>
                                </div>
                            </div>
                            <!-- 城市 -->
                            <div id="showCityPicker" role="button" aria-haspopup="listbox"
                                class="weui-cell weui-cell_active weui-cell_select weui-cell_select-after">
                                <div class="weui-cell__hd"><label class="weui-label">城市</label></div>
                                <div class="weui-cell__bd">
                                    <div class="weui-select">成都市</div>
                                </div>
                            </div>
                            <!-- 个人简介 -->
                            <div class="weui-cells__group weui-cells__group_form">
                                <div class="weui-cells__title">问题描述</div>
                                <div class="weui-cells weui-cells_form">
                                    <div class="weui-cell weui-cell_active">
                                        <div class="weui-cell__bd">
                                            <textarea class="weui-textarea" placeholder="请描述你所发生的问题"
                                                rows="3"></textarea>
                                            <div role="option" aria-live="polite" class="weui-textarea-counter">
                                                <span>0</span>
                                                /200
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- 保存信息 -->
                            <div class="weui-form__opr-area">
                                <a role="button" class="weui-btn weui-btn_primary" href="javascript:" id="showTooltips">
                                    保存信息
                                </a>
                            </div>
                        </div>

                    </div>
        </div>
        <!-- 引入 WeUI CDN JS文件-->
        <script src="https://res.wx.qq.com/open/libs/weuijs/1.2.1/weui.min.js" charset="utf-8"></script>
</body>

</html>